/**
 * 公用css
 */
 [v-cloak] {
  display: none;
}
html, body {
  min-height: 100%;
  background: #fff;
}
* {
  font-family: "Helvetica Neue",Helvetica,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","微软雅黑",Arial,sans-serif;
}
/* 调整占据整行的备注 field wtidh textarea*/
.textarea-field {
  .van-cell__value {
    overflow: visible!important;
  }
  display: block!important;
  .van-field__word-limit {
    position: absolute;
    top: -30px;
    right: 0;
  }
}
.van-popup--round {
  border-radius: 8px 8px 0 0!important;
}
.van-picker-column {
  position:relative;
  z-index: 1;
  &:before {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    content: '';
  }
  & > ul {
    z-index: -1;
    position: relative;
  }
}
/**
 * 重置toast背景色 模拟loading效果
 */
.loading-toast {
  background: transparent!important;
  color: transparent;
  .van-icon.van-toast__icon {
    width: 50%;
    height: 50%;
  }
  .van-image.van-icon__image {
    width: 100%;
    height: 100%;
  }
}
.loading-gif-refresh {
  height: 100%;
}
.popup-wrap {
  position: relative;
  padding-top: 51px;
  .tool-wrap {
    position: absolute;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px;
    top: 0;
    width: calc( 100vw - 30px );
    color: #333;
  }
  .popup-body {
    max-height: 65vh;
  }
  .van-radio, .van-checkbox {
    padding: 12px;
  }
  .active {
    color: #2E79FF;
  }
}

/* 移动van-overlay */
.van-overlay {
  top: -1px!important;
  height: calc(100% + 1px)!important;
}
.table-wrap {
  display: flex;
  max-width: 100vw;
  padding: 0 0 2px 2px;
  overflow-x: scroll;
  background: #e1ecff;
  border-top: 1px solid #eee;
  border-bottom: 1px solid #eee;
  .table-col {
    padding-right: 3px;
  }
  .table-header {
    display: inline-block;
    width: calc(25vw - 18px);
    padding: 7px;
    font-weight: bold;
    font-size: 15px;
  }
  .table-input-wrap {
    input {
      width: calc(25vw - 18px);
      padding: 7px;
      box-shadow:none; /*去除阴影*/
      outline: none;/*聚焦input的蓝色边框*/
      resize: none; /*textarea 禁止拖拽*/
      border: 1px solid #f5f5f5; /*去除边框*/
      border-radius: 0;
      -webkit-appearance: none;/*常用于IOS下移除原生样式*/
      -webkit-tap-highlight-color: rgba(0,0,0,0); /*点击高亮的颜色*/
    }
  }
}
.total-calc {
  padding: 15px;
  background: #e1ecff;
  text-align: right;
}
  
//nav-container是代表有自己导航栏
.nav-container{
  // padding-top: 46px;
}
// nav-foo-container代表有导航栏和底部栏
.nav-foo-container{
  padding-top: 46px;
  padding-bottom: 50px;
}
// 最外层的样式  如果有始终位于底部的按钮就用
.nav-first-container {
  height: 100vh;
  background-color: #F5F5F5;
  // overflow-y: hidden; //ios不支持
  -webkit-overflow-scrolling: touch;
}

/* 暂无数据  */
.no-data-img {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 30% 0 30% 0;
  background-color: #f5f5f5;

  img {
    width: 180px;
    height: 106px;
    text-align: center;
  }

  p{
    font-size: 17px;
    color: #333333
  }
}

.bg-white {
  background-color: #fff!important;
}
.bg-gray, .bg-grey {
  background-color: #F5F5F5;
}
.align-right{
  text-align: right;
}
.align-left{
  text-align: left;
}
.align-center{
  text-align: center;
}
.inline{
  display: inline;
}
.margin-b-10{
  margin-bottom: 10px;
}
.margin-t-15 {
  margin-top: 15px;
}
.margin-b-20 {
  margin-bottom: 20px;
}
/** 
 * 导航栏组件
 */
.van-nav-bar .van-icon{
  color: #333333;
  font-size: 20px;
}
.van-nav-bar__title{
  color: #333333;
  font-size: 17px;
  font-weight: bold;
}
.van-nav-bar__text{
  color: #2E79FF;
  font-size: 17px;
}
/**
 * cell组件
 */
.van-cell{
  font-size: 17px;
  color: #333333;
  line-height: 35px;
}
.van-cell__value{
  color: #333333;
}
.van-field__label{
  width: 110px;
}
/** 
 * 标签栏组件
 */
.van-tabs__line{
  background-color: #2E79FF;
  height: 2px;
}
.van-tab span{
  font-size: 17px;
}
.van-tab--active{
  color: #2E79FF;
}
/**
 * 按钮组件
 */
.van-button {
  border-radius: 4px;
}
/**
 * wangeditor
 */
.w-e-text-container{
  width: 100vw;
  height: 120px!important;
}
/**
 * treeSelect 分类选择
 */
.van-tree-select {
  font-size: 17px;
}
.van-sidebar-item {
  font-size: 17px;
}
.van-tree-select__selected {
  font-size: 17px!important;
}
/**
 * van-tag 组件修改
 */
.van-tag {
  border-radius: 4px;
}
/**
 * 自定义步骤条
 */
.steps-container {
  width: calc(100vw - 30px);
  background-color: #fff;
  padding: 15px 15px 0 15px;
}
.steps {
  position: relative;
  padding-bottom: 30px;

  &:last-child {
    .step-line {
      width: 0;
    }
  }
}
.step-right {
  padding-left: 55px;

  h3,h4{
    font-weight: normal;
  }
}
.step-line {
  width: 1px;
  height: 100%;
  position: absolute;
  left: 20px;
  top: 0px;
  background-color: #F5F5F5;
  z-index: 2;
}
.step-circle {
  border: 1px solid #C4C4C4;
  background-color: #C4C4C4;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  color: #fff;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 0px;
  left: 15px;
  z-index: 3;
  margin-top: 3px;
}
.circle-active {
  border: 1px solid #2E79FF;
  background-color: #2E79FF;
}
.step-title-class {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  margin-top: 0px;
  margin-bottom: 5px;
  margin-left: 5px;
  color: #333333;
  font-size: 15px;
}
.step-time-class {
  color: #999999;
  font-size: 12px;
  padding-left: 5px;
}
.step-container {
  margin-top: 10px;
  margin-bottom: 10px;
  margin-left: 5px;
  
  font-size: 15px;
  color: #333333;
  // font-weight: bold;
  // max-height: 47px;
  line-height: 23px;
  border-radius: 4px;
}
.step-container p {
  padding: 5px 10px;
  background-color: #F8F8F8;
}
.step-font-container {
  margin-top: 10px;
  margin-bottom: 5px;
  margin-left: 5px;
}
.step-img {
  height: 23px;
  width: 20px;
  margin-right: 9px;
}
.step-file {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  // margin-top: 15px!important;
  margin-bottom: 10px;
}
.margin-b-15{
  margin-bottom: 15px;
}
.step-width {
  min-width: 75%;
}
.max-width {
  max-width: calc(100% - 26%)
}
.pass-color {
  color: #01BF65;
}
.ing-color {
  color: #F5A703;
}
.defined-color {
  color: #F54B03;
}
// 表单详情页面
.attachment-class {
  background-color: #fff;
  padding: 15px 15px 5px 15px;
  font-size: 14px;
}

// 筛选-菜单 -- start
.search-area-title {
  width: calc(100vw - 30px);
  background-color: #fff;
  margin-top: 12px;
  padding: 10px 15px;

  .van-row {
    align-items:center;
  }
  .van-search {
    padding: 0;

    .van-search__content {
      border-radius: 4px;
    }
    
    .van-cell {
      padding: 0 8px 0 0;
    }
  }

  .search-img {
    width: 15px;
    height: 17px;
    padding: 5px;
  }
}
.filtrete-pop {
  max-height: 70vh;
}
.filtrate-title {
  position: fixed;
  width: 100vw;
}
.filtershow {
  padding: 0px 15px 5px 15px;
  font-size: 14px;
  color: #999999;
  background-color: #fff;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}
.filter-x {
  width: 16px;
  height: 16px;
}
.filter-span:after {
  content: ',';
}
.filter-span:last-child::after {
  content: '';
}
.filtrate-content {
  margin-top: 46px;
  margin-bottom: 50px;
  padding: 18px 15px;

  .filtrate-content-title {
    margin-bottom: 15px;
    color: #333333;
    font-size: 14px;
    font-weight: bold;
  }

  .filtrate-choose {
    color: #333333;
    font-size: 14px;
    border-radius: 4px;
    background-color: #F5F5F5;
    border: none;
    height: 40px;
    line-height: 40px;
    margin-bottom: 15px;
    padding: 0 15px;

    .van-checkbox__icon {
      display: none;
    }
    .van-checkbox__label {
      overflow: hidden;
      white-space: nowrap;
      text-overflow: ellipsis;
      margin-left: auto;
      margin-right: auto;
    }
  }
  .filtrate-choose_active {
    background-color: rgba(46, 121, 255, 0.2);

    .van-checkbox__label {
      color: #2E79FF;
    }
  }
}
.filtrate-button {
  position: fixed;
  bottom: 0;
  width: calc(100vw - 30px);
  padding: 0 15px;
  background-color: #fff;

  .default-class {
    display: flex;
    align-items: center;
    justify-content: center;
    color: #1989fa;
    margin: 10px 0px;
    font-size: 17px;
  }

  .info-class{
    height: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #2E79FF;
    border-radius: 5px!important;
    background-color: #2E79FF;
    color: #fff;
  }
}
// 筛选-菜单 -- end
// 状态值颜色 -- start
.common-agreen_color {
  // 绿色
  color: #01BF65;
}
.common-wait_color {
  // 黄色
  color: #F9B602
}
.common-default_color {
  // 蓝色
  color: #2E79FF;
}
.common-define_color {
  // 红色
  color: #F54B03
}
// 状态值颜色 -- end
// 表单附件 -- start
.file-flex {
  display: flex;
  align-items: center;
  flex-direction: row;
  justify-content: flex-start;
}
.form_file {
  font-size: 15px;
}
.form_file_div {
  margin-bottom: 20px;
}
.form_file_div:last-child {
  margin-bottom: 0;
}
// 表单附件 -- end
// 常用语弹出框 -- start
.userful-class {
  width: 100vw;
  height: 70vh;

  .userful-title {
  }
  .userful-div {
  }
  .van-cell {
    line-height: 24px;
    padding: 8px 15px;
    font-size: 14px;
  }
}
.add-class {
  display: flex;
  justify-content: flex-end;
  margin-right: 15px;
}
// 常用语弹出框 -- end
